<template>
    <div class="slider-box">
        <div class="c_row-item">
            <el-col class="label" :span="4" v-if="configData.title">
                {{ configData.title }}
            </el-col>
            <el-col :span="19" class="slider-box">
                <el-cascader :options="configData.list" placeholder="请选择分类" v-model="configData.activeValue"
                    :props="{ checkStrictly: true, emitPath: false, label: label, value: value }" filterable clearable
                    @change="sliderChange"></el-cascader>
            </el-col>
        </div>
    </div>
</template>

<script>
export default {
    name: 'c_cascader',
    props: {
        configObj: {
            type: Object
        },
        configNme: {
            type: String
        },
        number: {
            type: null
        },
    },
    data() {
        return {
            defaults: {},
            configData: {},
            timeStamp: '',
            label: 'label',
            value: 'value'
        }
    },
    created(){
        if (this.configObj.title = '栏目分类') {
            this.label = 'name'
            this.value = 'id'
        }
    },
    mounted() {

        this.$nextTick(() => {
            console.log(this.configObj, 'this.configObj');
            this.defaults = this.configObj
            this.configData = this.configObj[this.configNme]
        })
    },
    watch: {
        configObj: {
            handler(nVal, oVal) {
                this.defaults = nVal
                this.configData = nVal[this.configNme]
                if (this.configData.title == '栏目分类') {
                    this.label = 'name'
                    this.value = 'id'
                }
                
            },
            deep: true
        },
        number(nVal) {
            this.timeStamp = nVal;
        },
    },
    methods: {
        sliderChange(e) {
            console.log(1);
            let storage = window.localStorage;
            this.configData.activeValue = e ? e : storage.getItem(this.timeStamp);
            this.$emit('getConfig', { name: 'cascader', values: e })
        }
    }
}
</script>

<style scoped lang="scss"></style>
